<template>
  <div>
    <h2 ref="header">Ref传值</h2>
    <Child ref="child" />
    <button @click="$refs.child.count++">改变子组件中count</button>
    <hr />
    <p>
      注释: <br />
      * 如果ref设置给一个普通元素,则代表获取的是当前DOM节点<br />
      *
      如果ref设置给一个组件,则获取的是当前组件的组件实例,我们可以操作这个组件实例修改内部的数据<br />
    </p>
  </div>
</template>

<script>
import Child from "./Child";
export default {
  name: "Ref",
  components: {
    Child,
  },
  mounted() {
    console.log(this.$refs.header);
    console.log(this.$refs.child);
  },
};
</script>

<style></style>
